﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DragAndDrop.ascx.cs"
    Inherits="Skecthial.UI.Controls.DragAndDrop" %>
<script type="text/javascript" src="../assets/JS/script.js"></script>

<div style="width: 98%; height: 98%;">
    <div id="drag" style="width: 100%;">
        <table style="width: 100%;">
            <tr>
                <td class="none only">
                    <div style="width: 70%; float: left;">
                        <table style="width: 100%;">
                            <colgroup>
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                                <col style="width: 10%;" />
                            </colgroup>
                            <tbody>
                                <tr>
                                    <td id="message" class="mark">MSG </td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td class="" style="background-color: #ffb497;" colspan="2">
                                        <div style="font-size: 8px; color: #FFF; float: right; padding-bottom: 33px;">
                                            COUNTRY
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="single"></td>
                                    <td class="single"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                </tr>
                                <tr>
                                    <td class="single"></td>
                                    <td class="single"></td>
                                    <td class=" single"></td>
                                    <td class="single" style="background-color: #97c8ff;" rowspan="2" colspan="2">
                                        <div style="color: #FFF;">
                                            PLACE
                                        </div>
                                    </td>
                                    <td class="single" colspan="2" rowspan="2" style="background-color: #fff397;">
                                        <div style="color: #CCC;">
                                            EVENT
                                        </div>
                                    </td>
                                    <%-- <td></td>--%>
                                    <td class=" single"></td>
                                </tr>
                                <tr>
                                    <td class="single"></td>
                                    <td class="single"></td>
                                    <td class=" single"></td>
                                    <td class=" single"></td>
                                    <%--<td></td>
							<td></td>--%>
                                </tr>
                                <tr>
                                    <td></td>
                                    <td></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                    <td class=" single" style="background-color: #a1c9ae;"></td>
                                </tr>
                                <tr>
                                    <td class="trash" colspan="2">TRASH </td>
                                    <%--<td class="activity_cell single">
                            </td>--%>
                                    <td class=" single"></td>
                                    <td class=" single"></td>
                                    <td class=" single"></td>
                                    <td class=" single"></td>
                                    <td colspan="2" class="none only" style="background: #f7c987;">
                                        <div style="float: left; width: 60%;">
                                            <br />
                                            <input class="inputDate" id="inputDate" value="04/02/2012" style="width: 70px;">
                                            <br />
                                            <a href="#" onclick="javascript:return dateChange();" class="btnDate">Set Date</a>
                                        </div>
                                        <div style="float: left; width: 40%;">
                                            <table>
                                                <tr>
                                                    <td class="none only" style="width: 60px; max-height: 60px;">
                                                        <div id="timed">
                                                            <div style="vertical-align: bottom; min-width: 100%; max-width: 70px; height: 60px;
                                                                text-align: center; font-size: 11px; line-height: 105%;">
                                                                <div id="dtDay">
                                                                    DD
                                                                </div>
                                                                <br />
                                                                <div id="dtMonth" style="font-size: 24px; font-weight: bold; color: #CCC;">
                                                                    MM
                                                                </div>
                                                                <br />
                                                                <div id="dtYear">
                                                                    YYYY
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                    </td>
                                    <%--<td>
                            </td>--%>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div style="width: 28%; float: right;">
                        <div style="width: 100%;">                            <div id="AccordionContainer" class="AccordionContainer">
                                <div onclick="runAccordion(1);" class=" AccordionTitle1">
                                    <div class="AccordionTitle" onselectstart="return false;">
                                        Places
                                    </div>
                                </div>
                                <div id="Accordion1Content" class="AccordionContent">
                                    <table width="95%">
                                        <tr>
                                            <td class=" single">
                                                <asp:Repeater ID="rpPlace" runat="server" OnItemDataBound="rp1_dataBound">
                                                    <HeaderTemplate>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <div style="width: 20%; max-width: 60px; max-height: 60px; position: relative; float: left;
                                                            padding: 3px; margin-left: 5px; border: 1px solid #CCC;">
                                                            <div id="place" class="drag place clone climit1" dropped="0" type="place" uid="<%# Eval("id") %>"
                                                                obj="<%# Eval("obj") %>" style="width: 100%; max-width: 60px; max-height: 60px;">
                                                                <div align="center" class="imdiv">
                                                                <a class="personPopupTrigger" href="#" onclick="javascript:return false;" rel="<%# Eval("id") %>"
                                                                 type="place" name="<%# Eval("id") %>">
                                                                    <img src="../Objects/place/<%# Eval("id") %>" style="vertical-align: bottom; width: 100%;
                                                                        max-width: 60px; max-height: 60px;" />
                                                                        </a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div onclick="runAccordion(2);" class="AccordionTitle2">
                                    <div class="AccordionTitle" onselectstart="return false;">
                                        Activities
                                    </div>
                                </div>
                                <div id="Accordion2Content" class="AccordionContent">
                                    <table width="98%">
                                        <tr>
                                            <td class="none only">
                                                <asp:Repeater ID="rpActivity" runat="server" OnItemDataBound="rp1_dataBound">
                                                    <HeaderTemplate>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <div style="width: 20%; max-width: 60px; max-height: 60px; position: relative; float: left;
                                                            padding: 3px; margin-left: 3px; border: 2px solid #CCC;">
                                                            <div id="activity" class="drag activity clone climit1" dropped="0" type="activity"
                                                                uid="<%# Eval("id") %>" obj="<%# Eval("obj") %>" style="width: 100%; max-width: 60px;
                                                                max-height: 60px;">
                                                                <div align="center" class="imdiv">
                                                                 <a class="personPopupTrigger" href="#" onclick="javascript:return false;" rel="<%# Eval("id") %>"
                                                                 type="activity" name="<%# Eval("id") %>">
                                                                    <img src="../Objects/activity/<%# Eval("id") %>" style="vertical-align: bottom; width: 100%;
                                                                        max-width: 60px; max-height: 60px;" />
                                                                        </a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div onclick="runAccordion(3);" class="AccordionTitle3">
                                    <div class="AccordionTitle" onselectstart="return false;">
                                        Event
                                    </div>
                                </div>
                                <div id="Accordion3Content" class="AccordionContent">
                                    <table width="98%">
                                        <tr>
                                            <td class=" single">
                                                <asp:Repeater ID="rpEvent" runat="server" OnItemDataBound="rp1_dataBound">
                                                    <HeaderTemplate>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <div style="width: 20%; max-width: 60px; max-height: 60px; position: relative; float: left;
                                                            padding: 3px; margin-left: 3px; border: 2px solid #CCC;">
                                                            <div id="event" class="drag event clone climit1" dropped="0" type="event" uid="<%# Eval("id") %>"
                                                                obj="<%# Eval("obj") %>" style="width: 100%; max-width: 60px; max-height: 60px;">
                                                                <div align="center" class="imdiv">
                                                                    <a class="personPopupTrigger" href="#" onclick="javascript:return false;" rel="<%# Eval("id") %>"
                                                                 type="event" name="<%# Eval("id") %>">
                                                                    <img src="../Objects/event/<%# Eval("id") %>" style="vertical-align: bottom; width: 100%;
                                                                        max-width: 60px; max-height: 60px;" />
                                                                        </a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div onclick="runAccordion(4);" class="AccordionTitle4">
                                    <div class="AccordionTitle" onselectstart="return false;">
                                        Countries
                                    </div>
                                </div>
                                <div id="Accordion4Content" class="AccordionContent">
                                    <table width="98%">
                                        <tr>
                                            <td class=" single">
                                                <asp:Repeater ID="rpCountry" runat="server" OnItemDataBound="rp1_dataBound">
                                                    <HeaderTemplate>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <div style="width: 20%; max-width: 60px; max-height: 60px; position: relative; float: left;
                                                            padding: 3px; margin-left: 3px; border: 2px solid #CCC;">
                                                            <div id="country" class="drag country clone climit1" dropped="0" type="countries" uid="<%# Eval("id") %>"
                                                                obj="<%# Eval("obj") %>" style="width: 100%; max-width: 60px; max-height: 60px;">
                                                                <div align="center" class="imdiv">
                                                                     <a class="personPopupTrigger" href="#" onclick="javascript:return false;" rel="<%# Eval("id") %>"
                                                                 type="countries" name="<%# Eval("id") %>">
                                                                    <img src="../Objects/countries/<%# Eval("id") %>" style="vertical-align: bottom;
                                                                        width: 100%; max-width: 60px; max-height: 60px;" />
                                                                        </a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div onclick="runAccordion(5);" class="AccordionTitle5">
                                    <div class="AccordionTitle" onselectstart="return false;">
                                        People
                                    </div>
                                </div>
                                <div id="Accordion5Content" class="AccordionContent">
                                    <table width="95%">
                                        <tr>
                                            <td class=" single">
                                                <asp:Repeater ID="rpPeople" runat="server" OnItemDataBound="rp1_dataBound">
                                                    <HeaderTemplate>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <div style="width: 20%; max-width: 60px; max-height: 60px; position: relative; float: left;
                                                            padding: 3px; margin-left: 5px; border: 1px solid #CCC;">
                                                            <div id="people" class="drag people clone climit1" dropped="0" type="people" uid="<%# Eval("id") %>"
                                                                obj="<%# Eval("obj") %>" style="width: 100%; max-width: 60px; max-height: 60px;
                                                                background-color: transparent;">
                                                                <div align="center" class="imdiv" style="background-color: transparent;">
                                                                     <a class="personPopupTrigger" href="#" onclick="javascript:return false;" rel="<%# Eval("id") %>"
                                                                 type="people" name="<%# Eval("id") %>">
                                                                    <img src="../Objects/people/<%# Eval("id") %>" style="vertical-align: bottom; width: 100%;
                                                                        max-width: 60px; max-height: 60px;" />
                                                                        </a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="none only">
                    <div id="content"><ul id="contentList"></ul></div>
                    <div style="float: right;margin-top: 5px;">
                        <a onclick="LoadPosts('new');" class="buttonNew">
                            Add Event
                        </a>
                        <a onclick="AddNewPost();" class="buttonNew">
                            Add Event Test
                        </a>
                    </div>
                </td>
            </tr>
        </table>
    </div>
</div>
<div style="display: none;">
    <a id="fancyClose" href="#" onclick="LoadNewPost();">CLOSE TEST</a>
</div>
